<template>
<el-dialog :close-on-click-modal="false" :close-on-press-escape="false" :title="!dataForm.id ? $t('add') : $t('update')" :visible.sync="visible">
    <el-form :label-width="$i18n.locale === 'en-US' ? '120px' : '80px'" :model="dataForm" :rules="dataRule" @keyup.enter.native="dataFormSubmitHandle()" ref="dataForm">
        <el-form-item label="所在猪舍" prop="houseId">
            <el-input placeholder="所在猪舍" v-model="dataForm.houseId"></el-input>
        </el-form-item>
        <el-form-item label="母猪" prop="pigId">
            <el-input placeholder="母猪" v-model="dataForm.pigId"></el-input>
        </el-form-item>
            <div>值：{{ dataForm.mateDate }}</div>
        <el-form-item label="配种时间2224" prop="mateDate">
            <el-date-picker align="right" placeholder="日期" type="date" v-model="dataForm.mateDate" value-format="yyyy-MM-dd"></el-date-picker>
        </el-form-item>
        <el-form-item label="背膘厚度" prop="backfat">
            <el-input placeholder="背膘厚度" v-model="dataForm.backfat"></el-input>
        </el-form-item>
        <el-form-item label="母猪耳号" prop="sow">
            <el-input placeholder="母猪耳号" v-model="dataForm.sow"></el-input>
        </el-form-item>
        <el-form-item label="公猪耳号" prop="boar">
            <el-input placeholder="公猪耳号" v-model="dataForm.boar"></el-input>
        </el-form-item>
        <el-form-item label="配种类型" prop="type">
            <RenSelect dictType="mating_type" placeholder="配种类型" value="dataForm.type"></RenSelect>
        </el-form-item>
        <el-form-item label="精液等级" prop="level">
            <RenSelect dictType="semen_level" placeholder="精液等级" value="dataForm.level"></RenSelect>
        </el-form-item>
        <el-form-item label="配种员" prop="operator">
            <el-input placeholder="配种员" v-model="dataForm.operator"></el-input>
        </el-form-item>
        <el-form-item label="备注" prop="remark">
            <el-input placeholder="备注" v-model="dataForm.remark"></el-input>
        </el-form-item>
    </el-form>
    <template slot="footer">
        <el-button @click="visible = false">{{ $t("cancel") }}</el-button>
        <el-button @click="dataFormSubmitHandle()" type="primary">
            {{ $t("confirm") }}
        </el-button>
    </template>
</el-dialog>
</template>

<script>
import debounce from 'lodash/debounce'
/* eslint-disable */
export default {
    data() {
        return {
            pickerOptions: {},
            visible: false,
            dataForm: {
                id: "",
                houseId: "",
                pigId: "",
                mateDate: "",
                backfat: "",
                sow: "",
                boar: "",
                type: "",
                level: "",
                operator: ""
            }
        };
    },
    computed: {
        dataRule() {
            return {
                houseId: [{
                    required: true,
                    message: this.$t("validate.required"),
                    trigger: "blur"
                }],
                pigId: [{
                    required: true,
                    message: this.$t("validate.required"),
                    trigger: "blur"
                }],
                mateDate: [{
                    required: true,
                    message: this.$t("validate.required"),
                    trigger: "blur"
                }],
                backfat: [{
                    required: true,
                    message: this.$t("validate.required"),
                    trigger: "blur"
                }],
                sow: [{
                    required: true,
                    message: this.$t("validate.required"),
                    trigger: "blur"
                }],
                boar: [{
                    required: true,
                    message: this.$t("validate.required"),
                    trigger: "blur"
                }],
                type: [{
                    required: true,
                    message: this.$t("validate.required"),
                    trigger: "blur"
                }],
                level: [{
                    required: true,
                    message: this.$t("validate.required"),
                    trigger: "blur"
                }],
                operator: [{
                    required: true,
                    message: this.$t("validate.required"),
                    trigger: "blur"
                }],
                remark: [{
                    required: true,
                    message: this.$t("validate.required"),
                    trigger: "blur"
                }],
                updater: [{
                    required: true,
                    message: this.$t("validate.required"),
                    trigger: "blur"
                }],
                updateDate: [{
                    required: true,
                    message: this.$t("validate.required"),
                    trigger: "blur"
                }]
            };
        }
    },
    methods: {
        init() {
            this.visible = true;
            this.$nextTick(() => {
                this.$refs["dataForm"].resetFields();
                if (this.dataForm.id) {
                    this.getInfo();
                }
            });
        },
        // 获取信息
        getInfo() {
            this.$http
                .get(`/stock/mating/${this.dataForm.id}`)
                .then(({
                    data: res
                }) => {
                    if (res.code !== 0) {
                        return this.$message.error(res.msg);
                    }
                    this.dataForm = {
                        ...this.dataForm,
                        ...res.data
                    };
                })
                .catch(() => {});
        },
        // 表单提交
        dataFormSubmitHandle: debounce(
            function () {
                this.$refs["dataForm"].validate(valid => {
                    if (!valid) {
                        return false;
                    }
                    this.$http[!this.dataForm.id ? "post" : "put"](
                            "/stock/mating/",
                            this.dataForm
                        )
                        .then(({
                            data: res
                        }) => {
                            if (res.code !== 0) {
                                return this.$message.error(res.msg);
                            }
                            this.$message({
                                message: this.$t("prompt.success"),
                                type: "success",
                                duration: 500,
                                onClose: () => {
                                    this.visible = false;
                                    this.$emit("refreshDataList");
                                }
                            });
                        })
                        .catch(() => {});
                });
            },
            1000, {
                leading: true,
                trailing: false
            }
        )
    }
};
</script>
